<template>
    <div>
        <slot :user="userData"></slot>
        <slot name="postMes" :postMes="socialLinks"></slot>
    </div>

</template>

<script setup lang="ts">
import { ref } from 'vue'

const userData = ref({
    name: '张小明',
    age: 28,
    occupation: '前端工程师'
})

const socialLinks = ref([
    { name: 'GitHub', url: 'https://github.com' },
    { name: 'Twitter', url: 'https://twitter.com' }
])
</script>

<style scoped>
.child-component {
    padding: 10px;
    border: 1px solid #ccc;
}
</style>